<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Dashboard</title>

    <style type="text/css">
        
        a {
            text-decoration: none;
        }
        
        a.menuItem {

        }

        a.submenuItem {

        }

        a.selectedItem {
            text-decoration: underline;
        }

        .hidden {

        }

    </style>

    <script language="javascript" type="text/javascript" src="../script/jquery.js"></script>
    <script language="javascript" type="text/javascript" src="../script/common.js"></script>
    <script language="javascript" type="text/javascript" src="../script/dashboard.js"></script>

    <script language="javascript" type="text/javascript">

        jQuery(document).ready(function() {

            var userId = 0;
            var target = "#ctnMainList";

            // retrieve the data
            getUserServices(userId, target);
            jQuery("servicesLink").addClass("selectedItem");

            getServiceTypes("select[name='serviceTypeId']");

            // hook up event handlers
            jQuery("#servicesLink").click(function() {
                getUserServices(userId, target);

                selectLink("#servicesLink");
            });

            jQuery("#dataSourcesLink").click(function() {
                getDataSources(userId, target);

                selectLink("#dataSourcesLink");
            });

            jQuery("#keyStoresLink").click(function() {
                getKeyStores(userId, target);

                selectLink("#keyStoresLink");
            });
        });

    </script>
</head>
<body>

    <div id="menu">

    </div>

    <div id="submenu">
        <a id="servicesLink" >Services</a>
        <a id="dataSourcesLink" >Data sources</a>
        <a id="keyStoresLink" >Key stores</a>
    </div>

    <div id="ctnMainList">

    </div>

    <div>
        <div id="addServiceDialog">
            <h2>Add new service</h2>

            <form>
                Service type: <select name="serviceTypeId"></select>

                <div class="hidden">
                    Service name: <input name="name" type="text"/>

                    <input type="Submit"/>
                </div>
            </form>
        </div>

    </div>
</body>
</html>